{{layout/logo-heading
	title="Papertrail"
	desc="Display your cloud-based logs (https://papertrailapp.com)"
	icon=constants.Icon.Integrations}}

{{#section/base-editor document=document folder=folder page=page busy=waiting
	isDirty=(action "isDirty") onCancel=(action "onCancel") onAction=(action "onAction")}}

	<div class="grid-container-5-5">
		<div class="grid-cell-1">
			<form {{action "auth" on="submit"}} >
				<div class="form-group">
					<label>Papertrail API Key</label>
					{{focus-input id="papertrail-apitoken" type="password" value=config.APIToken class="form-control"}}
					<small class="form-text text-muted">API Token (from your profile)</small>
				</div>
				{{ui/ui-button color=constants.Color.Green light=true label=constants.Label.Authenticate onClick=(action "auth")}}
			</form>
		</div>
		<div class="grid-cell-2">
			{{#if authenticated}}
				<form {{action "onAction" on="submit"}}>
					<div class="form-group">
						<label for="papertrail-query">Search query</label>
						{{input id="papertrail-query" type="text" class="form-control mousetrap" value=config.query}}
						<small class="form-text text-muted">Determine which log entries you want to display e.g. bob OR ("some phrase" AND sally)</small>
					</div>
					<div class="form-group">
						<label for="papertrail-max">Maximum results</label>
						{{input id="papertrail-max" type="number" class="form-control mousetrap" value=config.max}}
						<small class="form-text text-muted">How many log entries do you want?</small>
					</div>
					<div class="form-group">
						<label for="group-dropdown">Group</label>
						{{ui/ui-select id="group-dropdown" prompt="<group>" content=options.groups action=(action "onGroupsChange") optionValuePath="id" optionLabelPath="name" selection=config.group}}
						<small class="form-text text-muted">Optional Papertrail group</small>
					</div>
				</form>
			{{/if}}
		</div>
	</div>

{{/section/base-editor}}
